<template>
  <div class="_wz_hiddenDangerModel">
    <div style="padding: 10px 0 0 0;">
      <Form ref="formAdd" :model="formData" label-position="right" :label-width="100" :rules="ruleValidate">
        <FormItem label="运输企业" prop="deptUuid">
          <i-select v-model="formData.deptUuid" filterable placeholder="请选择运输企业" clearable>
            <Option v-for="item in subDeptList" :value="item.uuid" :key="item.uuid">{{ item.deptName }}</Option>
          </i-select>
        </FormItem>
        <FormItem label="周期名称" prop="riskCycleName">
          <i-input v-model="formData.riskCycleName" placeholder="请填写周期名称" clearable></i-input>
        </FormItem>
        <Row>
          <Col span="10">
            <FormItem label="排查周期" prop="riskCycleNum">
              <span style="margin: 0 10px;">每</span>
              <InputNumber :max="100" :min="1" v-model.number="formData.riskCycleNum" placeholder="请填写排查数量" clearable style="width: calc(100% - 40px);"></InputNumber>
            </FormItem>
          </Col>
          <Col span="14">
            <!--排查周期-->
            <FormItem label="" prop="riskCycleUnit" class="_wz_riskCycleUnit">
              <i-select v-model.number="formData.riskCycleUnit" filterable placeholder="请选择排查周期" clearable>
                <Option :value="1">日</Option>
                <Option :value="2">周</Option>
                <Option :value="3">旬</Option>
                <Option :value="4">月</Option>
                <Option :value="5">季</Option>
                <Option :value="6">年</Option>
              </i-select>
              &emsp;/ 次
            </FormItem>
          </Col>
        </Row>
      </Form>
    </div>
    <div class="demo-drawer-footer" style="z-index: 99;">
      <Button style="margin-right: 8px" @click="$emit('closeFun', false)">取消</Button>
      <Button type="primary" @click="addSubmit('formAdd')">提交</Button>
    </div>
    <Spin size="large" fix v-if="spinShow"></Spin>

  </div>
</template>
<script>
export default {
  props: ['selectData'],//接收来自父组件的数据
  data() {
    return {
      spinShow: false,//本页加载
      formData: {
        riskCycleNum:1
      },
      ruleValidate: {//正则
        riskCycleName: [
          {required: true, message: '请填写周期名称', trigger: 'blur'}
        ],
        riskCycleNum: [
          {type:'number',required: true, message: '请填写排查周期', trigger: 'blur' },
        ],
        riskCycleUnit: [
          {type:'number',required: true, message: '请选择周期单位', trigger: 'blur'}
        ],
        deptUuid: [
          {required: true, message: '请选择运输企业', trigger: 'blur'}
        ],
      },
      subDeptList: [],//运输企业
      riskPointList: [],//排查清单

    }
  },
  beforeCreate() {//beforeCreate创建前状态

  },
  created() {//created创建完毕状态

  },
  beforeMount() {//beforeMount挂载前状态   DOM 元素然后塞入页面的过程

  },
  mounted() {//mounted 挂载结束状态
    var that = this;
    that.selectData.riskCycleNum = !!that.selectData.riskCycleNum ? that.selectData.riskCycleNum : 1;
    that.formData = that.selectData;

    that.axios.post(that.apiUrl.coreDeptCoreDeptList, {}).then(res => {
      if (!!res) {
        that.subDeptList = res.data.data;
        if (!!!that.selectData.id) {
          that.$set(that.formData, 'deptUuid', that.subDeptList[0].uuid)//赋值
          that.$set(that.formData, 'deptName', that.subDeptList[0].deptName)//赋值
        }
      }
    }).catch(err => {
      console.log("失败", err)
    })


  },
  methods: {//执行的方法
    //提交表单
    addSubmit(data) {
      let that = this;
      that.$refs[data].validate((valid) => {
        if (valid) {
          that.spinShow = true;//显示加载
          that.axios.post(that.apiUrl.riskPlanRiskCycleSaveOrUpdate, that.formData).then(res => {
            that.spinShow = false;//显示加载
            if (!!res) {
              that.$Message.success("保存成功");
              that.$emit("closeFun", true)
            }
          }).catch(err => {
            console.log('失败', err);
          })
        } else {
          that.$Message.error('请正确填写表单');
        }
      })

    },

  },
  watch: {//监听

  },
  beforeUpdate() {//beforeUpdate 更新前状态

  },
  updated() {//updated 更新完成状态

  },
  beforeDestroy() {//beforeDestroy 销毁前状态

  },
  destroyed() {//destroyed 销毁完成状态

  }
}
</script>
<style lang="less">
._wz_hiddenDangerModel {
  height: 100%;
  padding-bottom: 53px;
  ._wz_riskCycleUnit{
    .ivu-form-item-content{
      margin-left: 20px!important;
      .ivu-select{
        width: calc(100% - 50px);
        //margin-right: 40px;
      }
    }
  }
}
</style>
